<script setup lang='ts'>
import { PureTableBar } from "@/components/RePureTableBar";
import { useODBEquipmentDataCenter } from "./hooks/ODBEquipmentDataCenter"
const {
  columns,
  dataList,
  loading,
  pagination,
  btnloading,
  sendstatement,
  handleSizeChange,
  handleCurrentChange
} = useODBEquipmentDataCenter()
</script>

<template>
  <div class="main">
    <!-- 数据管理 -->
    <PureTableBar title="" class="list_hei">
      <template v-slot="{ size, checkList }">
        <pure-table border align-whole="center" showOverflowTooltip table-layout="auto" adaptive :loading="loading"
          size="small" :data="dataList" max-height="650" :columns="columns" :checkList="checkList"
          @size-change="handleSizeChange" @current-change="handleCurrentChange" :pagination="pagination"
          :header-cell-style="{
            background: 'var(--el-table-row-hover-bg-color)',
            color: 'var(--el-text-color-primary)'
          }">
          <template #operation="{ row }">
            <el-button type='primary' size="small" text @click="sendstatement(row)"
              :disabled="!(row.getCar == 2 || row.getCar == 4)" :loading="btnloading">
              <!-- 获取授权 -->
              {{
                row.getCar == 0 ? '未申请' :
                row.getCar == 1 ? '已申请' :
                  row.getCar == 2 ? '获取授权' :
                    row.getCar == 3 ? '发出授权声明' :
                      row.getCar == 4 ? '数据授权' :
                        row.getCar == 5 ? '获取授权声明' : '获取OBD数据'
              }}
            </el-button>
          </template>
        </pure-table>
      </template>
    </PureTableBar>
  </div>
</template>

<style scoped lang="scss">
@import url(@/style/CreditComm.scss);

:deep(.list_hei) {
  .flex {
    display: none;
  }
}

:deep(.pure-table) {
  height: 100%;
}

:deep(.el-dialog__footer) {
  text-align: center;
}
</style>
